// 对vue的全局指令进行封装
// 封装中间件函数的插件
const foucs = {
  install(Vue) {
    // 创建自定义指令
    Vue.directive('fofo', {
      // （输入框失去焦点和获取焦点）
      // 指令所在标签，被插入到真实DOM才触发，如果标签用display:none隐藏再出现，不会触发
      inserted(el) {
        fn(el)
      },
      // 指令所在标签更新时触发
      update(el) {
        fn(el)
      }
    })
  }
}

function fn(el) {
  setTimeout(() => {
    if (el.nodeName === 'TEXTAREA' || el.nodeName === 'INPUT') {
      el.focus()
    } else {
      const theInput = el.querySelector('input')
      const theTextArea = el.querySelector('textarea')
      if (theInput) theInput.focus()
      if (theTextArea) theTextArea.focus()
    }
  }, 500)
}

export default foucs
